昨天我們講完了專案的資料夾結構
今天我們來看看 Naming 命名規則
首先是檔案的命名

Naming

好的命名，能讓接手的人或者參與開源專案的人，更容易了解每個檔案他是在做什麼的
不好的命名，準備被開發的人幹到起飛(X

React 本身並沒有強制規範你的每個檔案的命名規則
為此我特別在 Youtube 稍微研究了一下大家的寫法
其實都大同小異

在這個專案中所使用的命名方式，與大多數的開發者相似

Component

首先我們看到 component

在 components 的資料夾中，元件是以 domain based 作為區分

domain based
資料夾裡面的檔案屬於相同「Domain」，利如權限、訂單等，則是使用 Domain 的名字來命名。
常用於 React 的元件切分。

其檔名皆為 upper camel case (大駝峰式命名法)
原因很間單，不論是 class 還是 functional component
都是使用 upper camel case 來命名
故也用於檔名上

仔細看可以發現
副檔名都是 .jsx 或 .tsx 結尾
這樣有一個好處
可以快速區分這個檔案是 component 還是一般的 class

Page

再來我們看到 Page 的部分

除了 index.tsx 之外，包含頁面和它所用的元件採用的一樣是大駝峰

這是我最早在練習專案時的 pages folder，那時候把 Page 寫成這樣

有沒有覺得第一個的寫法會更容易讓人知道
這個 folder 放的是 Page 呢

明天接續著看變數的命名

參考文章

那些年我們一起 review 的 code：通用規範